<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:wug="http://wug.jp/2009/wug"
      wug:root="jp.wug.samples.pragprog.Checkout"
        >
<head>
    <title>Pragprog Books Online Store</title>
    <link href="stylesheets/depot.css" media="all" rel="stylesheet" type="text/css"/>
</head>
<body id="store">
<div id="banner">
    <img src="images/logo.png"/>
    Pragmatic Bookshelf
</div>
<div id="columns">
    <div id="side">

        <!-- START:hidden_div -->
        <div wug:child="cart" id="cart">
            <div class="cart-title">Your Cart</div>
            <table>
                <tr wug:render="renderItems,getItem">
                    <td>${quantity}&#215;</td>
                    <td>${product.title}</td>
                    <td class="item-price">${product.price}</td>
                </tr>

                <tr class="total-line">
                    <td colspan="2">Total</td>
                    <td class="total-cell">${totalPrice}</td>
                </tr>
            </table>

            <form wug:form="form">
                <div><input wug:submit="checkout" type="submit" value="Checkout"/></div>
                <div><input wug:submit="clear" type="submit" value="Empty cart"/></div>
            </form>
            <!--
            <form method="post" action="/store/checkout" class="button-to"><div><input type="submit" value="Checkout" /></div></form>
            <form method="post" action="/store/empty_cart" class="button-to"><div><input type="submit" value="Empty cart" /></div></form>
            -->
        </div>
        <!-- END:hidden_div -->
        <a href="http://www....">Home</a><br/>
        <a href="http://www..../faq">Questions</a><br/>
        <a href="http://www..../news">News</a><br/>
        <a href="http://www..../contact">Contact</a><br/>
    </div>
    <div id="main">

        <div class="depot-form">
            <fieldset>
                <legend>Please Enter Your Details</legend>

                <form wug:form="form">
                    <p>
                        <label for="order_name">Name:</label>
                        <input wug:input="order.name" id="order_name" size="40" type="text"/>
                    </p>

                    <p>
                        <label for="order_address">Address:</label>
                        <textarea wug:input="order.address" cols="40" id="order_address" rows="3"></textarea>
                    </p>

                    <p>
                        <label for="order_email">E-Mail:</label>
                        <input wug:input="order.email" id="order_email" size="40" type="text"/>
                    </p>

                    <p>
                        <label for="order_pay_type">Pay with:</label>
                        <select wug:select="order.payType" id="order_pay_type">
                            <option value="">Select a payment method</option>
                            <option value="check">Check</option>
                            <option value="cc">Credit card</option>
                            <option value="po">Purchase order</option>
                        </select>
                    </p>

                    <input wug:submit="submit" class="submit" type="submit" value="Place Order"/>
                </form>
            </fieldset>
        </div>

    </div>
</div>
</body>
</html>